<style lang="less" scoped>
.help{
    .ivu-card-head-inner, .ivu-card-head p{
        height: auto;
        overflow: inherit;
    }
    
}
</style>

<template>
    <div class="help">
        <Row class="margin-top-10">
            <Card>
                <p slot="title" class="card-title">
                    <Row class="" :gutter="10">
                        <Col :md="4" :lg="2">
                            <div style="margin-top: 5px;">
                                <Icon type="ios-pulse"></Icon>
                                {{this.$route.meta.title}}
                            </div>
                        </Col>
                        <Col :md="20" :lg="22">
                            <!-- <Button type="primary"  size="small" style="margin-top: 0px;float: right;" @click="addHelp">添加</Button> -->
                        </Col>
                    </Row>
                </p>
                <div class="line-chart-con">
                    <Table border stripe :columns="title" :data.sync="gameinfo" ></Table>
                </div>
            </Card>
        </Row>
        <Modal
            v-model="editmodal"
            title="编辑"
            width="400"
            @on-ok="editok"
            @on-cancel="editcancel">
            <!-- <textarea id="articleEditor"></textarea> -->
            <Upload
                style="text-align: center;"
                :before-upload="handleUpload"
                action="//jsonplaceholder.typicode.com/posts/">
                <Button type="ghost" icon="ios-cloud-upload-outline">上传文件</Button>
            </Upload>
            <div style="text-align: center;color: #57a3f3;">图片尺寸375*160像素</div>
            <div style="text-align: center;" v-if="file == null&&thisfile !== '无'">{{ thisfile }}</div>            
            <div style="text-align: center;" v-if="file !== null">{{ file.name }}</div>
        </Modal>
    </div>
</template>

<script>

export default {
    components: {
        
    },
    data () {
        return {
            gameinfo:[],
            editmodal: false,
            addmodal: false,
            data:[],
            thisfile:'',
            file:null,
            thishelp:0,
            thisform:{
                id:0,
                gid:0,
                version:''
            },
            addform:{
                context:'',
                title:''
            },
            title:[
                {
                    title:'彩种名称',
                    key: 'name',
                    align:'center',
                },
                {
                    title:'说明文件',
                    key: 'context',
                    align:'center',
                    render: (h, params) => {
                        return h('div',{
                            style:{
                                overflow: 'hidden',
                                textOverflow:'ellipsis',
                                whiteSpace: 'nowrap'
                            }
                        },[
                            h(params.row.html_url!==''?'a':'div',{
                                attrs: {
                                    href:params.row.html_url==''?'#':params.row.html_url,
                                    target:"view_window"
                                },
                            },this.htmlurl(params.row.html_url))
                        ]);
                    }
                },
                {
                    title:'操作',
                    key: '',
                    align:'center',
                    render: (h, params) => {
                        let _this=this
                        return h('div',[
                            h('Button', {
                                props: {
                                    size: 'small',
                                    type:'primary',
                                },
                                style:{
                                    
                                },
                                on:{
                                    click: () => {
                                        this.thishelp=params.index
                                        this.thisform.id=params.row.pid
                                        this.thisform.gid=params.row.id
                                        this.thisform.version=params.row.version
                                        this.file=null
                                        this.thisfile=this.htmlurl(params.row.html_url)
                                        this.editmodal=true
                                    }
                                }
                            },'编辑')
                        ])
                    }
                }
            ]
        }
    },
    computed: {
        
    },
    methods: {
        init(){
            this.getGameCodex()
        },
        handleUpload (file) {
            this.file = file;
            return false;
        },
        htmlurl(url){
            if(url==''){
                return '无'
            }else{
                var urlArr = url.split('?');
                var k = urlArr[0], appU = k.split('/');
                var L = appU[appU.length - 1];
                return L
            }
        },
        editok(){
            let form = new FormData();
            if(this.file!==null){
                form.append("gid", this.thisform.gid);
                form.append("up_file", this.file);
                if(this.thisfile=='无'){
                    this.$api.repeater(this,'addGameCodex',form).then(res=>{
                        if(res.success==true){
                            this.gameinfo[this.thishelp].html_url=res.data.html_url
                            this.gameinfo[this.thishelp].version=res.data.version
                            this.$Notice.success({
                                title: '上传成功',
                            });
                        }else{
                            this.$Notice.error({
                                title: '上传失败',
                                desc: res.error
                            });
                        }
                    })
                }else{
                    form.append("id", this.thisform.id);
                    form.append("version", this.thisform.version);
                    this.$api.repeater(this,'setGameCodex',form).then(res=>{
                        if(res.success==true){
                            this.gameinfo[this.thishelp].html_url=res.data.html_url
                            this.gameinfo[this.thishelp].version=res.data.version
                            this.$Notice.success({
                                title: '上传成功',
                            });
                        }else{
                            this.$Notice.error({
                                title: '上传失败',
                                desc: res.error
                            });
                        }
                    })
                }
            }
            
            
            
        },
        editcancel(){

        },
        getGameCodex(){
            this.$api.getGameCodex().then(response=>{
                response.json().then(responseJson=> {
                    if(responseJson.data==null){
                        this.data=[]
                    }else{
                        for(let i=0;i<responseJson.data.length;i++){
                            for(let j=0;j<this.gameinfo.length;j++){
                                if(responseJson.data[i].gid==this.gameinfo[j].id){
                                    this.gameinfo[j].version=responseJson.data[i].version
                                    this.gameinfo[j].html_url=responseJson.data[i].html_url
                                    this.gameinfo[j].pid=responseJson.data[i].id
                                }
                            }
                        }
                        // this.data=responseJson.data
                    }
                })
            })
        }
    },
    mounted (){
        let game=JSON.parse(sessionStorage.gameInfo).lottery_set
        var result = [];
        for (var i in game) {
            let g={
                version:'',
                html_url:'',
                pid:0,
                ...game[i]
            }
            // g.
            result.push(g)
        }
        this.gameinfo=result
        this.init()
    },
    destroyed () {
        
    }
};
</script>
